<template>
  <main>
    <a-card title="不动感的影集">
      <a-timeline>
        <a-timeline-item
          v-for="record of cardRecords"
          :key="record.id"
          :color="useRandomColor()"
        >
          <a-button @click="record.handle">
            {{ record.content }}
          </a-button>
        </a-timeline-item>
      </a-timeline>
    </a-card>
  </main>
</template>

<script>
import { photoViewConfig } from "@vp/show/photo.js";
import { useRandomColor } from "@u/color.js";
export default {
  setup() {
    const { cardRecords } = photoViewConfig;
    return {
      cardRecords,
      useRandomColor,
    };
  },
};
</script>

<style>
</style>